<template>
  <div class="navbar">
    <el-menu
      :default-active="route.fullPath"
      class="el-menu-demo"
      mode="horizontal"
      :router="true"
    >
      <el-menu-item index="/" style="width: 100px;">
        <img
          style="width: 100px; float: left;"
          src="../assets/MyLogo.jpeg"
          alt="logo"
        />
      </el-menu-item>
      <el-menu-item index="/">首页</el-menu-item>
      <el-menu-item index="/blog">博客中心</el-menu-item>
      <el-menu-item index="/project">项目展示</el-menu-item>
      <el-menu-item index="" @click="handleClick">管理后台</el-menu-item>
    </el-menu>
  </div>
</template>

<script setup>
import { useRoute } from 'vue-router';


const route = useRoute()
const handleClick = ()=> {
  window.location = "http://localhost:8080"
}
</script>

<style lang="scss" scoped>
.el-menu {
  height: 75px;
}
.navbar {
  position: sticky;
  top: 0px;
  z-index: 1000;
}
</style>